<template>
<!-- 流程发起页面 -->
  <div style="height:100%;" class="process_title">
    <WorkFlowLaunchList
        style="height:100%;"
        :showLeftTree="true"
        :showSearch="true"
        :isSingle="true"
        :nwfSchemeInfoIdList="nwfSchemeInfoIdList"
        :nwfRelationId="nwfRelationId"
        @launchProcess="launchProcess"
    >
    </WorkFlowLaunchList>
    <elDialog
      v-if="elDialog.visible"
      :visible.sync="elDialog.visible"
      :title="elDialog.title"
      :width="elDialog.width"
      :append-to-body="elDialog.appendToBody"
      :modal="false"
      :close-on-click-modal="false"
      :show-close="true"
      :fullscreen="true"
      :destroy-on-close="true"
      :before-close="handleCloseWrap"
    >
      <CreateFLow
        :nwfSchemeInfoId="nwfSchemeInfoId"
        :infoList="infoList"
        :nwfRelationId="nwfRelationId"
        @closeDialog="closeDialog"
      ></CreateFLow>
    </elDialog>
  </div>
</template>
<script>
import WorkFlowLaunchList from "@/components/workflow/WorkFlowLaunchList";
import CreateFLow from "./components/CreateFLow"; //流程发起预览组件
import { getStore } from "@/util/store.js";
// 接口
export default {
  name: "WFLaunch",
  props: {
    showLeftTree: {
      type: Boolean,
      default: true,
    },
    nwfRelationId:'',
     nwfSchemeInfoIdList:{
      type: Array,
      default: ()=>{
        return []
      },
    },
  },
  components: {
    WorkFlowLaunchList,
    CreateFLow
  },
  data() {
    return {
      // 对话框组件
      elDialog: {
        visible: false,
        title: "弹框示题",
        width: "80%",
        appendToBody: true,
      },
      nwfSchemeInfoId:"",
      launchInfo:{
         F_Category:'',
          F_Name:'',
          F_Code:''
      }
    };
  },
  created () {
    /* 获取主题开始 */
    let themeName = getStore({ name: "themeName" }) || "default";
    this.themeName = themeName;
    /* 获取主题结束 */
    this.initRouter()
  },
  mounted () {
    //系统表单依赖localStorage清空
    window.localStorage.setItem("lookSystemForm", 0);
  },
  methods: {
    initRouter(){
      let obj = {}
      if(!this.$route.query.id) return
      if(this.$route.query.id == 1) {
        obj = {"F_Id":"e595d957f7074acb35b4cfc96861bc67","F_Code":"leave_application","F_Name":"请假","F_Category":"人事管理","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"8b2ebe29-ea42-11ec-b215-92b2f6a02c55","F_ModelId":"5d576e04-c493-11ec-ae60-a20f0c1ecb41","F_CreateDate":"2022-04-25 20:57:54","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      } else if(this.$route.query.id == 2){
        obj = {"F_Id":"618be9705953346cdca0111d6bd21900","F_Code":"overtime_application","F_Name":"加班","F_Category":"人事管理","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"a8689be1-e931-11ec-b1bd-224a58a98acb","F_ModelId":"ac317d04-c21c-11ec-96d3-421176c37a69","F_CreateDate":"2022-04-22 17:18:31","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      }else if(this.$route.query.id == 3){
        obj = {"F_Id":"603861a291dc55800452a9dc06a70539","F_Code":"bussiness_travel","F_Name":"出差","F_Category":"人事管理","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"aeaf8577-ea59-11ec-a1f2-864269275bd4","F_ModelId":"f7de4b0b-c50d-11ec-b3d5-a20f0c1ecb41","F_CreateDate":"2022-04-26 11:11:00","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      }else if(this.$route.query.id == 4){
        obj = {"F_Id":"34370df1ba47907c576aba17771ab1e2","F_Code":"get_out","F_Name":"外出","F_Category":"人事管理","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"9a672317-ea26-11ec-a1d7-de46cc7ee719","F_ModelId":"358f7c72-c22f-11ec-97e1-421176c37a69","F_CreateDate":"2022-04-22 19:30:10","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      }else if(this.$route.query.id == 5){
        obj = {"F_Id":"77acdb0431a1849d98c74e17ada80905","F_Code":"replacement-card","F_Name":"补卡申请","F_Category":"人事管理","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"fadf6ab8-1cd9-11ed-a920-0a0027000003","F_ModelId":"d466216b-1cd8-11ed-a920-0a0027000003","F_CreateDate":"2022-08-16 04:31:19","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      }else if(this.$route.query.id == 6){
        obj = {"F_Id":"9d39904f3d9acded721645c9d1ae2000","F_Code":"daily_reimbursement","F_Name":"日常报销","F_Category":"综合财务","F_EnabledMark":1,"F_Mark":1,"F_IsInApp":2,"F_Description":"","F_DeploymentId":"75c9bb4a-0692-11ed-af20-0a0027000003","F_ModelId":"112cd6aa-de6f-11ec-bef0-6e6a625ec098","F_CreateDate":"2022-05-28 18:15:43","F_CreateUserName":"张三丰","icon_file_id":null,"icon_file_info":null}
        this.launchProcess(obj)
      }

    },
    closeDialog() {
      this.elDialog.visible = false;
    },
    launchProcess(item) {
      this.elDialog.title = this.$t('workFlow.createFLow.hintLaunchFlow')+"【" + item.F_Name + "】";
      this.nwfSchemeInfoId = item.F_Id;
      //增加暗色主题，保留样式类
      document.body.className = document.body.className + ' original';
      let {F_Category,F_Name,F_Code} = item;
      this.infoList=[
        // {title:this.$t('workFlow.WFLaunch.stampCode'),value:F_Code},
        {title:"流程名称",value:F_Name},
        {title:"流程分类",value:F_Category}
      ];
      this.elDialog.visible = true;
    },
    handleCloseWrap() {
      //删除暗色兼容样式类
      let bodyClass = document.body.className.split(' ');
      bodyClass.filter((item,idx)=>{
        return item == 'original' && (bodyClass.splice(idx,1));
      });
      document.body.className = bodyClass.join(' ');
      this.elDialog.visible = false;
    }
  },
};
</script>
<style scoped>
 .eveningTheme .process_title div /deep/ .main-content .main-box, .eveningTheme .process_title div /deep/ .main-content{
		background-image:none!important;
	}
  /* ::v-deep .el-dialog__headerbtn > .el-icon-close:before{
    content:'关闭' !important;
    color: red;
    font-weight: bold;
  } */
  /deep/ .work-flow-tabs{
    padding-bottom: 50px;
  }
</style>
